<template>
  <div>
    <Header :scrollTop="scrollTop" />
    <HotNav :scrollTop="scrollTop" />
    <router-view></router-view>
    <Footer />
  </div>
</template>

<script>
import Footer from './components/Footer/Footer.vue'
import HotNav from './components/HotNav.vue'
import Header from './components/Header'
export default {
  name: 'App',
  components: {
    //  Index,
    Header,
    HotNav,
    Footer,

    // AddShopping
  },
  data() {
    return {
      // 监听页面滚动条
      scrollTop: 0,
    }
  },
  mounted() {
    // 监听页面滚动条
    window.addEventListener('scroll', () => {
      // 获取body标签
      // 监听滚动条的距离
      let scrollTop =
        document.documentElement.scrollTop || document.body.scrollTop
      // console.log(scrollTop)
      this.scrollTop = scrollTop
    })
  },
  beforeDestory() {
    window.removeEventListener('scroll')
  },
}
</script>

<style></style>
